<include file="Public/header" />
<title>个人认证</title>
<link rel="stylesheet" href="__PUBLIC__/Api/assets/css/reset.css">
<!-- <script src="__PUBLIC__/Api/assets/js/rem.js"></script> -->
<link rel="stylesheet" href="__PUBLIC__/Api/assets/css/font-awesome.min.css">
<link rel="stylesheet" href="__PUBLIC__/Api/assets/css/personalR.css">

<script src="__PUBLIC__/Api/localResizeIMG.js"></script>
<script src="__PUBLIC__/Api/mobileBUGFix.mini.js"></script>
</head>

<body>
<div class="rel-content">
    <div class="per-header">个人认证<i class="fa fa-angle-left back" onclick="goback()"></i></div>
    <div style="width:100%;margin:10px auto;padding:10px;position: relative;">
        <form enctype="multipart/form-data">
            <input required='' type='text' name="name" value="<?php echo $arr['name']?>">
            <label alt='请输本人姓名' placeholder='本人姓名'></label>
            <input required='' type='text' name='phone' value="<?php echo $arr['phone']?>">
            <label alt='请输入手机号码' placeholder='手机号码'></label>
            <p class="upLoad-imgID">请上传身份证正反面:</p>
            <div class="preID">
                <div class="userID">
                    <img src="<?php echo $arr['sfz_z']?$arr['sfz_z']:'__PUBLIC__/Api/images/preId.png';?>" alt="" class="preID">
                    <input type="file" class="inputfile" id="preID" name='preID'>
                </div>
                <div class="userID">
                    <img src="<?php echo $arr['sfz_f']?$arr['sfz_f']:'__PUBLIC__/Api/images/preId.png';?>" alt="" class="backID">
                    <input type="file" class="inputfile" id="backID" name="backID" >
                </div>
            </div>




            <input type="hidden" name="id" value="<?php echo $arr['id']?>">
            <button class="rel-submit">提交</button>
        </form>
    </div>
</div>


<script>
    var formData = new FormData();
    /**jquery图片压缩***/
    /**
     * 将以base64的图片url数据转换为Blob 可以直接上传文件
     * @param urlData
     *            用url方式表示的base64图片数据
     */
    function convertBase64UrlToBlob(urlData){

        var bytes=window.atob(urlData.split(',')[1]);        //去掉url的头，并转换为byte

        //处理异常,将ascii码小于0的转换为大于0
        var ab = new ArrayBuffer(bytes.length);
        var ia = new Uint8Array(ab);
        for (var i = 0; i < bytes.length; i++) {
            ia[i] = bytes.charCodeAt(i);
        }

        return new Blob( [ab] , {type : 'image/png'});
    }
    $('#backID').localResizeIMG({

        width: 400,

        quality: 1.0,

        success: function (result) {
            //convertBase64UrlToBlob函数是将base64编码转换为Blob
            formData.append("backID",convertBase64UrlToBlob(result.base64));  //append函数的
            $(".backID").attr('src', result.base64);

        }
    });
    $('#preID').localResizeIMG({
        width: 400,
        quality: 1.0,
        success: function (result) {
            //convertBase64UrlToBlob函数是将base64编码转换为Blob
            formData.append("preID",convertBase64UrlToBlob(result.base64));  //append函数的
            $(".preID").attr('src', result.base64);
        }
    });




    // 验证手机号
    function isPhoneNo(phone) {
        var pattern = /^1[34578]\d{9}$/;
        return pattern.test(phone);
    }
    // 验证中文名称
    function isChinaName(name) {
        var pattern = /^[\u4E00-\u9FA5]{1,6}$/;
        return pattern.test(name);
    }
    // 验证身份证
    function isCardNo(card) {
        var pattern = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
        return pattern.test(card);
    }
    function goback() {
        history.go(-1); //返回上一页
    }
    //上传图片
    //    function preeID(id, obj) {
    //        var file = obj.files[0];
    //        if (!file) {
    //            return;
    //        }
    //        if (file.size > 6048000) {
    //            alert('请上传小于5M的图片');
    //            return;
    //        }
    //        var reader = new FileReader();
    //        reader.readAsDataURL(file);
    //        reader.onload = function (f) {
    //            var result = document.getElementsByClassName(id)[0];
    //            var src = f.target.result;
    //            $("." + id).attr('src', src);
    //        }
    //
    //    }

    //提交form表单
    $('.rel-submit').click(function (e) {
        e.preventDefault();
        var name = $('input[name="name"]').val();
        var phone = $('input[name="phone"]').val();
        var preID = document.getElementById("preID").files[0];
        var backID = document.getElementById("backID").files[0];
        var bankCard = $('input[name="yhkh"]').val();
        var bankPhone = $('input[name="yhkphone"]').val();
        var bankArea = $('input[name="yhkgs"]').val();
        var id = $('input[name="id"]').val();


        formData.append('name', name);
        formData.append('phone', phone);
        formData.append('preID', preID);
        formData.append('backID', backID);
        formData.append('yhkh', bankCard);
        formData.append('yhkphone', bankPhone);
        formData.append('yhkgs', bankArea);
        formData.append('id', id);

        if(!isChinaName(name)){
            layer.msg('姓名不正确', {icon: 2});
            return false;
        }

        //合理性判断
        if(!isPhoneNo(phone)){
            layer.msg('手机号码不正确', {icon: 2});
            return false;
        }


//        console.log(preID);
//        return;
        layer.msg('图片较大,处理中。。。',{time:40000});
        $.ajax({
            url: "",
            type: "post",
            data: formData,
            dataType:'json',
            contentType: false,
            processData: false,
            mimeType: "multipart/form-data",
            success: function (data) {
                console.log(data);
                layer.msg(data.msg, {icon: data.type});
                if(data.type==1){
                    setTimeout(function(){
                        location.href="{:U('index/relation')}";
                    },1000);
                }
            },
            error: function (data) {
                console.log(data);
            }
        });
    })
</script>
</body>

</html>
